function getCookie(name) {
    //yy csrf_token=xxxxx  xxx
    var r = document.cookie.match("\\b" + name + "=([^;]*)\\b");
    return r ? r[1] : undefined;
}

var imageCodeId = "";

function generateUUID() {
    var d = new Date().getTime();
    if(window.performance && typeof window.performance.now === "function"){
        d += performance.now(); //use high-precision timer if available
    }
    var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
        var r = (d + Math.random()*16)%16 | 0;
        d = Math.floor(d/16);
        return (c=='x' ? r : (r&0x3|0x8)).toString(16);
    });
    return uuid;
}

function generateImageCode() {
    //1.生成图片验证码的编号，当前采用uuid字符串作为图片验证码的编号
    // var imageCodeId = generateUUID()
    imageCodeId = generateUUID()
    //2.拼接生成图片验证码的路由地址：/api/v1.0/image_codes/100
    var url = '/api/v1.0/image_codes/'+imageCodeId
    //3.找到图片验证码图片，设置它的src属性值为我们定义好的url变量
    //
    $(".image-code img").attr("src",url)
}

function sendSMSCode() {
    // $(".phonecode-a"):通过类样式得到a对象
    //删除a连接中的onclick事件
    $(".phonecode-a").removeAttr("onclick");
    //$("#mobile"):获取手机号的文本框对象
    //val():获取控件的value属性的值
    var mobile = $("#mobile").val();
    if (!mobile) { //说明用户没有输入手机号
        // $("#mobile-err span")找到span元素
        //html("请填写正确的手机号！"):将内容设置到元素的内容不符
        $("#mobile-err span").html("请填写正确的手机号！");
        $("#mobile-err").show(); //show():将元素显示出来
        //给超链接a标签设置属性  onclick="sendSMSCode();"
        $(".phonecode-a").attr("onclick", "sendSMSCode();");
        return;
    }

    var imageCode = $("#imagecode").val();//得到用户输入的图片验证码内容
    if (!imageCode) {
        //<span>请填写验证码！</span>
        $("#image-code-err span").html("请填写验证码！");
        $("#image-code-err").show();//将当前元素div显示出来
        // <a onclick="sendSMSCode();"></a>
        $(".phonecode-a").attr("onclick", "sendSMSCode();");
        return;
    }
    //发送一个ajax请求
    //$.get(请求的目标地址，查询字符串,回调函数,"json")
    ///api/v1.0/sms_codes/15033889441?image_code_id=xxx&image_code=yyy
    $.get("/api/v1.0/sms_codes/"+mobile,//发送请求的目标地址：/api/v1.0/sms_codes/手机号
        {image_code_id:imageCodeId,image_code:imageCode},
        function(data){ //data是后端将json字符串转化成js对象后的结果
        //当服务器成功处理请求后自动调用当前方法
            if (0 != data.errno) {
                $("#image-code-err span").html(data.errmsg); 
                $("#image-code-err").show();
                $(".phonecode-a").attr("onclick", "sendSMSCode();");
            }   
            else {
                var $time = $(".phonecode-a");
                var duration = 60;

                // intervalid = setInterval(function () {
                //     //一秒调用一次当前函数
                // },1000)
                var intervalid = setInterval(function(){

                    $time.html(duration + "秒"); 
                    if(duration === 1){
                        //清除定时器
                        clearInterval(intervalid);
                        $time.html('获取验证码'); 
                        $(".phonecode-a").attr("onclick", "sendSMSCode();");
                    }
                    duration = duration - 1;
                }, 1000, 60); 
            }
    }, 'json'); 
}


$(document).ready(function() {
    //当页面加载完毕后自动执行当前函数
    generateImageCode();
    //$("#mobile").focus(function(){//当文本框获得焦点时自动调用当前函数})
    $("#mobile").focus(function(){
        $("#mobile-err").hide();
    });
    $("#imagecode").focus(function(){
        $("#image-code-err").hide();
    });
    $("#phonecode").focus(function(){
        $("#phone-code-err").hide();
    });
    $("#password").focus(function(){
        $("#password-err").hide();
        $("#password2-err").hide();
    });
    $("#password2").focus(function(){
        $("#password2-err").hide();
    });

    $(".form-register").submit(function(e){
        e.preventDefault();//阻止表单的默认提交事件

        mobile = $("#mobile").val();
        phoneCode = $("#phonecode").val();
        passwd = $("#password").val();
        passwd2 = $("#password2").val();
        if (!mobile) {
            $("#mobile-err span").html("请填写正确的手机号！");
            $("#mobile-err").show();
            return;
        } 
        if (!phoneCode) {
            $("#phone-code-err span").html("请填写短信验证码！");
            $("#phone-code-err").show();
            return;
        }
        if (!passwd) {
            $("#password-err span").html("请填写密码!");
            $("#password-err").show();
            return;
        }
        if (passwd != passwd2) {
            $("#password2-err span").html("两次密码不一致!");
            $("#password2-err").show();
            return;
        }

        //自定义js对象，封装需要传递到后端的数据
        var req_data = {
            mobile:mobile,
            sms_code:phoneCode,
            password:passwd,
            password2:passwd2
        }

        //将js对象转化成json字符串
        req_json = JSON.stringify(req_data)
        //向后端服务器发送请求
        $.ajax({
            url:"/api/v1.0/users", //指定发送请求的目标服务器的地址
            type:"post",//指定客户端提交方式为post提交
            data:req_json, //指定前端向后端发送的json字符串数据
            contentType:"application/json", //指定前端向后端发送的数据类型为json
            dataType:"json", //指定服务器端向客户端回送的数据的类型
            headers:{ //指定请求头信息
                "X-CSRFToken":getCookie("csrf_token")
            },
            success:function (response) {
                console.log("response="+response)
                alert("response="+response+",typeof="+typeof(response))
                //response是服务器回送到前端的数据内容，并且自动将其转化成js对象
                if (response.errno=="0"){
                    alert("注册成功")
                    console.log("注册成功")
                    //跳转到首页
                    location.href="/index.html"
                }else{
                     alert("注册失败")
                    console.log("注册失败")
                    alert(response.errmsg)
                }

            }
        })
    });
})